<!-- 冲裁派工：蹇泽阳 -->
<template>
  <div class="app-container">
    <!-- 打印汇总表 -->
    <div class="printContent2">
      <div style="width: 100%; height: 650px" v-for="item in printArr">
        <div class="center size-24 title">{{ $t(`Print.PunchingDispatchWorkOrderSummaryTableManual`) }}</div>
        <div class="header" style="display: flex; justify-content: space-evenly">
          <span>{{ $t(`Print.Operator`) }}:{{ item.name }}</span>
          <span>{{ $t(`Print.DispatchDate`) }}:{{ item.dispatchDateDuring }}</span>
          <span>{{ $t(`Print.DateOfPrinting`) }}:{{ item.printDate }}</span>
        </div>
        <div class="mainTable">
          <table style="text-align: center; font-size: 16px; margin-top: 10px">
            <tr>
              <td class="size-16 center">{{ $t(`Print.DispatchDate`) }}:</td>
              <td class="size-16 center">{{ $t(`Print.Body`) }}</td>
              <td class="size-16 center">{{ $t(`Print.Directives`) }}</td>
              <td class="size-16 center">{{ $t(`Print.Place`) }}</td>
              <td class="size-16 center">{{ $t(`Print.MaterialName`) }}</td>
              <td class="size-16 center">{{ $t(`Print.DispatchPairs`) }}</td>
              <td class="size-16 center">{{ $t(`Print.Cuttinglayers`) }}</td>
              <td class="size-16 center">{{ $t(`Print.Knives`) }}</td>
            </tr>
            <tr v-for="item2 in item.arr">
              <td class="size-16 center">{{ item2.dispatchDate }}</td>
              <td class="size-16 center">{{ item2.style }}</td>
              <td class="size-16 center">{{ item2.lotNo }}</td>
              <td class="size-16 center">{{ item2.partName }}</td>
              <td class="size-16 center">{{ item2.mtlName }}</td>
              <td class="size-16 center">{{ item2.dispatchQty }}</td>
              <td class="size-16 center">{{ item2.usage }}</td>
              <td class="size-16 center">{{ item2.cutNum }}</td>
            </tr>
            <tr>
              <td colspan="8" class="size-16 right">{{ $t(`Print.TotalCutting`) }}:{{ item.total }}</td>
            </tr>
          </table>
        </div>
        <div class="mainTable footer">
          <span style="margin-right: 100px">{{ $t(`Print.PunchingSectionLeader`) }}:</span>
          <span>{{ $t(`Print.Operator`) }}:</span>
        </div>
      </div>
    </div>

    <!-- 打印标签 -->
    <div class="printContent">
      <div v-for="item in printTag.list" style="width: 70mm; height: 51.31mm; padding: 2mm" class="main">
        <div class="left" style="width: 28%">
          <span>{{ printTag.company }}</span>
          <img :src="item.imgUrl" alt="" style="width: 120%" />
          <span class="size-16">{{ item.dispatchDeptName }}</span>
          <span class="size-16">{{ item.dispatchWorker }}</span>
        </div>
        <div style="flex: 1">
          <table>
            <tr>
              <td class="size-10 center pad3" colspan="2">{{ $t(`Print.The`) }}{{ item.lsNo }}{{ $t(`Print.Round`) }}:{{ item.batchCode }}</td>
              <td class="size-10 center pad3" colspan="2">{{ printTag.now }}</td>
            </tr>
            <tr>
              <td class="size-10 center pad3" colspan="4">{{ item.lotNo }}</td>
            </tr>
            <tr>
              <td class="size-10 center pad3" colspan="4">{{ item.style }}</td>
            </tr>
            <tr>
              <td class="size-10 center pad3" colspan="4">{{ item.partName }}</td>
            </tr>
            <tr>
              <td class="size-10 center pad3">{{ $t(`Print.GuestNumber`) }}</td>
              <td class="size-10 center pad3">{{ $t(`Print.ChongdaoNo`) }}</td>
              <td class="size-10 center pad3" colspan="2">{{ item.qty }}{{ $t(`Print.Double`) }}</td>
            </tr>
            <tr>
              <td class="size-10 center pad3">{{ item.sizeNo }}#</td>
              <td class="size-10 center pad3">{{ item.cutSize }}#</td>
              <td class="size-10 center pad3">{{ $t(`Print.Deduction`) }}</td>
              <td class="size-10 center pad3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
            </tr>
          </table>
          <span class="size-10" v-for="item2 in item.processList" style="margin-left: 0px; transform: scale(0.7)">
            <input type="checkbox" />{{ item2 }}
          </span>
        </div>
        <div class="page-break"></div>
      </div>
    </div>

    <!-- 打印派工单 -->
    <div style="width: 100%; height: 14cm; padding-top: 10px" class="printContent3">
      <div class="center size-18 title">{{ printObj.company + $t(`Print.PunchesAndDispatchesWorkOrders`) }}</div>
      <table class="no-border">
        <tr>
          <td width="30%"></td>
          <td class="center size-12" width="30%">
            ({{ $t(`Print.DateOfPrinting`) }}:<span>{{ printObj.dispatchDate }}</span
            >)
          </td>
          <td class="size-12" width="30%">
            {{ $t(`Print.DispatchTicketNumber`) }}: <span>{{ printObj.planNo }}</span>
          </td>
        </tr>
      </table>

      <div class="headerTable">
        <img :src="printObj.imgUrl" alt="" style="height: 20mm" />
        <table class="no-border">
          <tr>
            <td class="size-12 left">{{ $t(`Print.DateOfManufacture`) }}:{{ printObj.dispatchDate }}</td>
            <td class="size-12 center">{{ $t(`Print.Operator`) }}:{{ printObj.cutWorkerName }}</td>
            <td class="size-12 right">{{ $t(`Print.Inspectors`) }}:{{ printObj.checkWorkerName }}</td>
          </tr>
          <tr>
            <td class="size-12 left">{{ $t(`Print.Directives`) }}:{{ printObj.lotNo }}</td>
            <td class="size-12 center">{{ $t(`Print.Body`) }}:{{ printObj.style }}</td>
            <td class="size-12 right">{{ $t(`Print.Color`) }}:{{ printObj.color }}</td>
          </tr>
          <tr>
            <td class="size-12 left">{{ $t(`Print.ChongdaoNo`) }}:{{ printObj.cutNo }}</td>
            <td class="size-12 center">{{ $t(`Print.LastNumberOne`) }}:{{ printObj.lastNo }}</td>
            <td class="size-12 right">{{ $t(`Print.OrderVolume`) }}:{{ printObj.orderQtyStr }}</td>
            <td class="size-12 right">{{ $t(`Print.Rounds`) }}:{{ printObj.lsNoStr }}</td>
          </tr>
        </table>
      </div>
      <div class="mainTable">
        <table style="text-align: center; font-size: 12px">
          <tr>
            <td class="size-10 center">{{ $t(`Print.SerialNumber`) }}</td>
            <td class="size-10 center" style="width: 70px">{{ $t(`Print.Place`) }}</td>
            <td class="size-10 center">{{ $t(`Print.NameOfArticle`) }}</td>
            <td class="size-10 center">{{ $t(`Print.Specification`) }}</td>
            <td class="size-10 center">{{ $t(`Print.Unit`) }}</td>
            <td class="size-10 center">{{ $t(`Print.Dosage`) }}</td>
            <td class="size-10 center">{{ $t(`Print.NumberOfLayers`) }}</td>
            <td class="size-10 center">{{ $t(`Print.NumberOfKnives`) }}</td>
            <td class="size-10 center">{{ $t(`Print.NumberOfPieces`) }}</td>
            <td class="size-10 center">{{ $t(`Print.Remark`) }}</td>
          </tr>
          <tbody>
            <tr v-for="item in printObj.list">
              <td class="size-10 center">{{ item.seqNo }}</td>
              <td class="size-10 center">{{ item.partName }}</td>
              <td class="size-10 center">{{ item.mtlName }}</td>
              <td class="size-10 center">{{ item.mtlSpec }}</td>
              <td class="size-10 center">{{ item.mtlUnit }}</td>
              <td class="size-10 center">{{ item.usage }}</td>
              <td class="size-10 center">{{ item.cutLayer }}</td>
              <td class="size-10 center">{{ item.cutCount }}</td>
              <td class="size-10 center">{{ item.cutNum }}</td>
              <td class="size-10 center">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
            </tr>
            <tr>
              <td class="size-10 right" colspan="10">{{ $t(`Print.TotalDispatch`) }}:{{ printObj.cutNumCount }}&nbsp;&nbsp;&nbsp;</td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="mainTable">
        <table style="text-align: center; font-size: 10px; margin-top: 10px">
          <tr v-for="item in printObj.sizeList">
            <td v-for="item2 in item" class="size-10 center">{{ item2 }}</td>
          </tr>
        </table>
      </div>
    </div>

    <Find :OriginalFilter="{ static: true }" :formList="formList" @findClicked="findClicked" />
    <div class="flex mt10" style="width: 100%; background-color: white">
      <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
        <div class="flex">
          <el-button class="primaryBth" type="primary" size="default" @click="insert">{{ $t(`Print.InsertDispatchProfile`) }}</el-button>
          <el-button class="primaryBth" type="primary" size="default" @click="insert">{{
            $t(`Print.PunchInspectionRelationshipMaintenance`)
          }}</el-button>
          <el-button class="primaryBth" type="primary" size="default" @click="printSummary">{{ $t(`Print.PrintTheSummaryTable`) }}</el-button>
          <el-button class="primaryBth" type="primary" size="default" @click="printOnSearch(1)">{{
            $t(`Print.PrintRoundLabelsBySearchCriteria`)
          }}</el-button>
          <el-button class="primaryBth" type="primary" size="default" @click="printOnSearch(2)">{{
            $t(`Print.PrintRoundLabelNotPrinted`)
          }}</el-button>
          <el-button class="primaryBth" type="danger" size="default" @click="removeList">{{ $t(`Print.Delete`) }}</el-button>
        </div>
        <Table
          :tableHeader="tableHeader"
          :tableData="tableData"
          selection
          class="mt10"
          :isLoading="isLoading"
          @currentRow="currentRow"
          @selectList="selectTableList"
          @download="download"
        />
        <el-card shadow="never" :body-style="{ padding: '5px' }">
          <PageModule
            :PageData="{ total, buttonS: true }"
            :pageSize="pageSize"
            @pageSizeChange="handleSizeChange"
            @pageChange="handleCurrentChange"
          />
        </el-card>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
        <h1 class="f16">{{ $t(`Print.DispatchNumberDetails`) }}</h1>
        <Table :tableHeader="tableHeader2" :tableData="tableData2" class="mt10" :isLoading="isLoading2" />
      </el-card>
    </div>

    <el-drawer v-model="drawer" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <div class="flex AIC" style="flex-direction: column">
        <Find
          :OriginalFilter="{ static: true }"
          @remoteMethod="remoteMethod10"
          :formList="formList10"
          @findClicked="findClicked10"
          @selectListShow="selectListShow10"
        />
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <div class="flex">
              <el-button class="primaryBth ml10" type="primary" size="default" @click="drawerInsert">{{ $t(`Print.InsertDispatcher`) }}</el-button>
              <el-select
                class="select"
                v-model="getSelectedLists"
                @change="getSelectedListsChange"
                @click="getChildren"
                ref="selectRef"
                :placeholder="$t(`Print.Number`)"
                multiple
                filterable
                clearable
                ><el-option v-for="V in getSelectedListsValue" :key="V" :value="V" @click="getoption(V)" />
              </el-select>
              <div class="flex ml10">{{ $t(`Print.TotalNumberOfKnives`) }} {{ Total }}</div>
            </div>
            <el-table
              v-loading="treeIsLoading"
              @selection-change="selectionChangeTree"
              :data="treeData"
              style="width: 100%; margin-bottom: 20px"
              row-key="title"
              border
              ref="TRef"
            >
              <el-table-column type="selection" width="60" align="center" />
              <el-table-column prop="title" :label="$t(`Print.Position_Instruction_Number_Label`)" width="250" />
              <el-table-column prop="cutBatch" :label="$t(`Print.Cutting_punchingNumber_Bagging_Batch`)" width="150" align="center" />
              <el-table-column prop="remainQty" :label="$t(`Print._Number_Of_Dispatchable_Quantities`)" width="100" align="center" />
              <el-table-column prop="realQty" :label="$t(`Print._Actual_Number_Of_Dispatches_Even_Number_Of_Labels`)" width="150" align="center" />
              <el-table-column prop="mtlOrderQty" :label="$t(`Print.Part_No_Order_Total_Even_Number_`)" width="260" align="center" />
            </el-table>
          </el-card>
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <div class="flex AIC">
              <h1 class="f16 mr10">{{ $t(`Print.PunchInspectionInformationOnTheSameDay`) }}</h1>
              <el-input style="height: 26px; width: 120px" v-model="user" :placeholder="$t(`Print.Punching`)" clearable></el-input>
              <el-button type="primary" class="primaryBth ml10" @click="searchUser">{{ $t(`Print.Inquire`) }}</el-button>
            </div>
            <h5 style="color: red">{{ $t(`Print.ClickOnTheCurrentRowToSelectTheEmployee`) }}</h5>
            <el-table
              highlight-current-row
              @current-change="currentRow11"
              class="mt10"
              :data="tableData11"
              style="width: 100%"
              row-key="cutWorkerId"
              border
              default-expand-all
            >
              <el-table-column prop="cutWorkerName" :label="$t(`Print.Punching`)" align="center" width="120" />
              <el-table-column prop="name" :label="$t(`Print.Inspectors`)" align="center" />
              <el-table-column prop="cutNum" :label="$t(`Print.NumberOfKnives`)" align="center" />
              <el-table-column prop="address" :label="$t(`Print.Operate`)" align="center" width="125">
                <template #default="scope">
                  <el-button type="primary" class="primaryBth" size="default" @click="download2(scope.row)">{{
                    $t(`Print.ViewDispatchDetails`)
                  }}</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </div>
      </div>
    </el-drawer>

    <!-- 查看派工信息 -->
    <el-drawer v-model="drawer2" :title="`【${currentTable11Row.cutWorkerName}】 【${dispatchDate}】派工明细`" :direction="'ttb'" size="small">
      <div class="flex AIC" style="flex-direction: column">
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <Table :tableHeader="tableHeader10" :tableData="tableData10" class="mt10" row-key="id" :outTableHeight="150" />
          </el-card>
        </div>
      </div>
    </el-drawer>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import formDataReq from '@/utils/formDataReq'
import LoginWork from '@/utils/LoginWork'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'PunchingDispatchingWorkers'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ElLoading, ElMessage } from 'element-plus'
import service from '@/utils/request'
import { debounce, throttle } from 'lodash'
import { nextTick, onMounted, ref, watch } from 'vue'
import qrcode from 'qrcode'

onMounted(() => {
  const style = document.createElement('style')
  style.innerHTML = `
    @media print {
      .page-break {
        break-after: page;
      }
    }
  `
  document.head.appendChild(style)
})

// 删除按钮
const removeList = async () => {
  if (selectedLists.value.length === 0) {
    JMessage.error('请勾选要删除的指令')
    return
  }
  const res = (await LoginWork.post('/cut/plan/dispatch/delete', selectedLists.value)) as any
  if (res.code === 200) {
    JMessage.success('删除成功')
    getTableList()
  } else {
    JMessage.error(res.message)
  }
}
// 插入派工资料模块
const number = ref('')
const numberOptions = ref([]) as any
const user = ref('')
const drawer = ref(false)
const insert = async () => {
  drawer.value = true
  getUserList()
  if (treeData.value) treeData.value.splice(0)
  treeData.value = []
  formList10.value[1].selectValue = ''
  formList10.value[2].selectValue1 = []
  formList10.value[2].selectOptions = []
}
// 当日冲工点检信息
const tableHeader11 = ref([
  {
    label: '冲工',
    prop: 'cutWorkerName'
  },
  {
    label: '点检人员',
    prop: 'checkWorkerName'
  },
  {
    label: '刀数',
    prop: 'cutNum'
  },
  {
    width: '120',
    type: 'findDetail',
    label: '操作'
  }
])
const tableData11 = ref([]) as any
const dispatchDate = ref('')
const getUserList = async () => {
  const date = new Date()
  const year = date!.getFullYear()
  const month = String(date!.getMonth() + 1).padStart(2, '0') // 使用padStart确保月份是两位数
  const day = String(date!.getDate()).padStart(2, '0') // 使用padStart确保日期是两位数
  const hours = String(date!.getHours()).padStart(2, '0') // 小时
  const minutes = String(date!.getMinutes()).padStart(2, '0') // 分钟
  const seconds = String(date!.getSeconds()).padStart(2, '0') // 秒
  // 返回格式化的日期时间字符串
  dispatchDate.value = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
  const res2 = (await service.post(
    `/cut/plan/dispatch/loadCuttingCheckerList2?dispatchDate=${dispatchDate.value.split(' ')[0]}&cutWorkerName=${user.value}`
  )) as any
  const arr = []
  for (const key in res2) {
    arr.push({
      cutWorkerId: key,
      cutWorkerName: key,
      children: res2[key]
    })
  }
  tableData11.value = arr
}
onMounted(() => {
  getUserList()
  //insert()
})

watch(drawer, async (newVal) => {
  if (newVal === false) {
    formList10.value[1].selectOptions = []
    formList10.value[2].selectOptions = []
    getTableList()
  }
})
const formList10 = ref([
  {
    type: 'dateSingle',
    dateLabel: '生产日期',
    dateValue: ''
  },
  {
    type: 'selectRM',
    selectValue: '',
    selectP: '选择指令',
    selectLabel: '',
    selectOptions: [],
    loading: false
  },
  {
    type: 'select1',
    selectValue1: '',
    selectP: '轮次',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '查询'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
]) as any
const treeIsLoading = ref(false)
const findClicked10 = async (content: string) => {
  if (content === '查询') {
    getTreeList()
  }
  if (content === '置空') {
    formList10.value[2].selectOptions = []
    formList10.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
      item.selectValue1 = ''
    })
  }
}
const selectListShow10 = (visible: any, item: any) => {
  if (Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '选择指令' && visible) {
    treeData.value = []
    formList10.value[2].selectValue1 = ''
  }
}
const editTreeDataTitle = (item: any) => {
  item.title1 = item.title.key
  item.title = item.title.value
  if (item.children && item.children.length > 0) {
    item.children.forEach((item2: any) => {
      editTreeDataTitle(item2)
    })
  }
  return item
}
const getTreeList = async () => {
  treeIsLoading.value = true
  const lsNos = [] as any
  treeData.value = []
  if (formList10.value[2].selectValue1) {
    for (const key in formList10.value[2].selectValue1) {
      lsNos.push(formList10.value[2].selectValue1[key])
    }
  }
  const res = (await LoginWork.post(`/cut/plan/dispatch/tree/list?lotNo=${formList10.value[1].selectValue}&lsNos=${lsNos}`)) as any
  if (res.code === 200) {
    treeData.value = res.data.map((item: any) => {
      editTreeDataTitle(item)
      return item
    })
    treeIsLoading.value = false
  } else {
    JMessage.error(res.message)
    treeIsLoading.value = false
  }
}
const remoteMethod10 = async (query: any) => {
  if (query !== '') {
    formList10.value[1].loading = true
    formList10.value[1].selectOptions.splice(0)
    // 指令查询
    const res = (await service.post('/cut/plan/dispatch/lot/page', {
      lotNo: query,
      pageNum: '1',
      pageSize: '99999',
      style: ''
    })) as any
    formList10.value[1].selectOptions = res.list.map((item: any) => {
      return {
        value: item.lotNo,
        label: item.lotNo
      }
    })
    formList10.value[1].loading = false
  } else {
    formList10.value[1].selectOptions.value = []
  }
}
watch(formList10.value[1], async () => {
  if (formList10.value[1].selectValue) {
    formList10.value[2].selectOptions.splice(0)
    formList10.value[2].selectValue1 = ''
    // 轮次查询
    const res2 = (await service.post(`/cut/plan/dispatch/lsNo/list?lotNo=${formList10.value[1].selectValue}`)) as any
    if (res2)
      res2.forEach((item: any) => {
        formList10.value[2].selectOptions?.push({
          optionKey: item,
          optionLabel: item,
          optionValue: item
        })
      })
  }
})
const treeData = ref([]) as any

const tableHeader10 = ref([
  {
    label: '派工单号',
    prop: 'planNo'
  },
  {
    label: '生产日期',
    prop: 'dispatchDate'
  },
  {
    label: '指令号',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '部位',
    prop: 'partName'
  },
  {
    width: '160',
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    label: '操作员',
    prop: 'workerName'
  },
  {
    label: '开始轮数',
    prop: 'lsNo'
  },
  {
    label: '截止轮数',
    prop: 'lsNo2'
  },
  {
    label: '派工数量',
    prop: 'dispatchQty'
  },
  {
    label: '刀数',
    prop: 'cutNum'
  }
])
const tableData10 = ref([]) as any
const selectedLists10 = ref([])
const selectTableList10 = (selectedList: any) => {
  selectedLists10.value = selectedList
}
const currentTable11Row = ref({}) as any
const currentRow11 = async (row: any = tableData11.value[0]) => {
  currentTable11Row.value = row
}
const drawer2 = ref(false)
const download2 = async (row: any) => {
  currentTable11Row.value = row
  if (formList10.value[0].dateValue) dispatchDate.value = formList10.value[0].dateValue
  const res = (await LoginWork.post(
    `/cut/plan/dispatch/cutWorkerDispatchHeadList?dispatchDate=${
      formList10.value[0].dateValue ? formList10.value[0].dateValue : dispatchDate.value.split(' ')[0]
    }&workerId=${row.cutWorkerId}`
  )) as any
  if (res.code === 200) {
    const arr = []
    for (const key in res.data) {
      arr.push({
        id: key,
        planNo: key,
        children: res.data[key]
      })
    }
    tableData10.value = arr
    drawer2.value = true
  } else {
    JMessage.error(res.message)
  }
}
const searchUser = () => {
  getUserList()
}

//_______________________________________________________________________________________________________________________________________________________________________________
//号码选择器（树）
let getSelectedLists: any = ref([]) //当前选中的项列表
let getSelectedListsValue: any = ref([]) //选项
let TRef: any = ref(null) as any // 表格选中的状态
//获取选项
const getChildren = throttle(() => {
  getSelectedListsValue.value = []
  let g: any = ref<Array<any>>([])
  treeData.value.forEach((item: any) => {
    item.children.forEach((item2: any) => {
      item2.children.forEach((item3: any) => {
        g.value.push(item3)
      })
    })
  })
  ///选项去重
  removeDuplicates(g.value).forEach((item: any) => {
    getSelectedListsValue.value.push(item.title)
  })
}, 1000)

////选择器关联
// getoption(V: string) 优先级小于 getSelectedListsChange = async (e: any)
const getoption = (V: string) => {
  getSelectedListsADDarr(TRef.value.getSelectionRows(), V, Array.from(getSelectedLists.value))
}
const getSelectedListsChange = async (e: any) => {
  if (e.length == 0) {
    TRef.value.clearSelection()
  } else {
    await getSelectedListsADDarr(TRef.value.getSelectionRows(), '', e)
  }
}
const currentSelectTree = ref([]) as any
var selectionChangeTreeTOarr: any = []
let Total = ref(0)
const selectionChangeTree = async (newSelection: any[]) => {
  if (newSelection.length > 0) {
    //号码回响
    await getSelectedListsADDarr(newSelection)
  }
  currentSelectTree.value = []
  newSelection = TRef.value.getSelectionRows()
  /// 号码过滤
  selectionChangeTreeTOarr = newSelection.filter((item: any) => item.type === 'label').map((item: any) => item.title)
  //刀数过率
  Total.value = 0
  let T: any = newSelection.filter((item: any) => item.type === 'label').map((item: any) => item.remainQty)
  //console.log(T)
  T.forEach((i: any) => {
    Total.value += Number(i)
  })
  let n: any = TRef.value
    .getSelectionRows()
    .reduce((acc: string[], i: any) => {
      if (i.type === 'size' && !acc.includes(i.title)) {
        acc.push(i.title)
      }
      return acc
    }, [])
    .sort()
  getSelectedLists.value = Array.from(new Set(n))
  currentSelectTree.value = selectionChangeTreeTOarr
}
//父项列表
let parentRow = [] as any
//子级项列表（交互）
let SubLevelRow = [] as any
//原始子级
let OriginalSubLevelRow = [] as any
//次父级项列表（交互）
let SecondParentRow = [] as any
//原始次父级
let OriginalSecondParentRow = [] as any
//k 子，v 父
let allMap: Map<any, any> = new Map()
//排除项
let disRow: any[] = []
///列表关联

const getSelectedListsADDarr = throttle((rowItems: any[], V?: any, e?: any[]) => {
  parentRow = []
  SubLevelRow = []
  SecondParentRow = []
  OriginalSubLevelRow = []
  OriginalSecondParentRow = []
  allMap.clear()
  disRow = []

  for (const item of treeData.value) {
    if (rowItems.includes(item)) {
      parentRow.push(item)
    }
    for (const item3 of item.children) {
      OriginalSecondParentRow.push(item3)
      if (rowItems.includes(item3)) {
        SecondParentRow.push(item3)
      }
      for (const item4 of item3.children) {
        OriginalSubLevelRow.push(item4)
        if (rowItems.includes(item4)) {
          SubLevelRow.push(item4)
          allMap.set(item4, item3)
          allMap.set(item3, item)
        }
      }
    }
  }
  // console.log(allMap)
  if (e == undefined) {
    if (rowItems.filter((i: any) => i.type === 'label').length == 0) {
      TRef.value.clearSelection()
    } else {
      //获取选项重新赋值的数据
      // ///排除项初始化
      const subLevelSet = new Set(SubLevelRow)
      let disRow: any = OriginalSubLevelRow.filter((x: any) => !subLevelSet.has(x))
      //父级联动
      // for (const item of SubLevelRow) {
      //   if (allMap.get(item)) {
      //     TRef.value.toggleRowSelection(allMap.get(allMap.get(item)), true)
      //   }
      // }
      //排除子级
      disRow.forEach((i: any) => {
        TRef.value.toggleRowSelection(i, false)
      })
      //console.log(allMap,SubLevelRow,SecondParentRow)
    }
  } else {
    //选项重新赋值
    if (treeData.value.length == 1) {
      TRef.value.toggleRowSelection(treeData.value[0], true)
    }
    if (parentRow.length == 0) {
      JMessage.warning('请先勾选部位')
      getSelectedLists.value = ['请勾选部位']
    } else {
      if (V != undefined) {
        //console.log(' else if (V !== undefined)',V)
        for (const item of SecondParentRow) {
          for (const item2 of item.children) {
            if (V.includes(item2.title)) {
              TRef.value.toggleRowSelection(item2, true)
            }
          }
        }
      }

      // console.log(e,SubLevelRow)
      // SubLevelRow.forEach((item: any) => {
      //   const ESet = new Set(e);
      //   if (!ESet.has(item.title)) {
      //      // console.log(item.title)
      //     TRef.value.toggleRowSelection(item, false)
      //   }
      // })
      handleUnselectedItems(SubLevelRow, e, TRef.value.toggleRowSelection)
    }
  }
}, 1000)

// 去重函数
const removeDuplicates = (nodes: any[]): any[] => {
  const seenTitles = new Set()
  const uniqueNodes = []
  for (const node of nodes) {
    if (!seenTitles.has(node.title)) {
      seenTitles.add(node.title)
      uniqueNodes.push(node)
    }
  }
  return uniqueNodes
}
const handleUnselectedItems = (nodes: any[], selectedTitles: string[], toggleSelection: (node: any, selected: boolean) => void) => {
  if (!selectedTitles?.length || !nodes?.length) return

  const selectedTitleSet = new Set(selectedTitles)
  const forceUpdate = selectedTitles.length < nodes.length // 性能优化点

  for (const node of nodes) {
    if (!selectedTitleSet.has(node.title)) {
      toggleSelection(node, false)
      if (!forceUpdate) break // 当需要取消全部选择时提前退出
    }
  }
}

//-----

const drawerInsert = async () => {
  const res = (await LoginWork.post('/cut/plan/dispatch/doDispatch', {
    checkWorkerId: currentTable11Row.value.checkWorkerId,
    cutWorkerId: currentTable11Row.value.cutWorkerId,
    dispatchDate: dispatchDate.value,
    labelNos: currentSelectTree.value,
    lotNo: formList10.value[1].selectValue
  })) as any

  if (res.code === 200) {
    // drawer.value = false
    download({ planNo: res.message }, { label: '打印派工单' })
    // 调用查询按钮
    getTableList()
    getTreeList()
  } else {
    JMessage.error(res.message)
  }
}

const formList = ref([
  {
    type: 'date',
    dateLabel: '生产日期',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入派工单号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入部位',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入操作员',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '派工单打印',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '轮次标签打印',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '我的',
    selectP: '归属人',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '财务审核',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
]) as any

// 表一模块
const tableHeader = ref([
  {
    label: '生产日期',
    prop: 'dispatchDate'
  },
  {
    label: '指令号',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    width: 80,
    label: '部位',
    prop: 'partName'
  },
  {
    width: 140,
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    width: 60,
    label: '冲工',
    prop: 'workerName'
  },
  {
    label: '开始轮数',
    prop: 'lsNo'
  },
  {
    label: '截止轮数',
    prop: 'lsNo2'
  },
  {
    label: '派工数量',
    prop: 'dispatchQty'
  },
  {
    width: 60,
    label: '刀数',
    prop: 'cutNum'
  },
  {
    label: '派工单号',
    prop: 'planNo'
  },
  {
    label: '派工人员',
    prop: 'dispatchCnName'
  },
  {
    label: '派工单打印',
    prop: 'printFlag'
  },
  {
    label: '轮次标签打印',
    prop: 'printLabelFlag'
  },
  {
    width: '80px',
    label: '财务审核',
    prop: 'salaryFlag'
  },
  {
    type: 'function',
    width: '200px',
    label: '操作',
    prop: [
      { label: '打印派工单', bgColor: '#1C84C6' },
      { label: '打印标签', bgColor: '#23C6C8' }
    ]
  }
])
// 表一按钮
const findClicked = (content: string) => {
  if (content === '置空') {
    formList.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
    })
  }
}
const tableData = ref([])
const isLoading = ref(true)
// 分页器
const currentPage = ref(1)
const pageSize = ref(20)
const total = ref(0)
const handleSizeChange = (val: number) => {
  pageSize.value = val
  getTableList()
}
const handleCurrentChange = (val: number) => {
  currentPage.value = val
  getTableList()
}
// 获取表数据
const getTableList = debounce(async () => {
  isLoading.value = true
  let tableDataList = await service.post<any, any>('/cut/plan/dispatch/dispatchHeadList', {
    lotNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入指令'
    )?.inputValue,
    slipDateStart:
      formList.value.find((item: any) => Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '生产日期')?.dateValue?.[0] || '',
    slipDateEnd:
      formList.value.find((item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '生产日期')
        ?.dateValue?.[1] || '',
    planNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入派工单号'
    )?.inputValue,
    partName: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入部位'
    )?.inputValue,
    workerName: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '请输入操作员'
    )?.inputValue,
    printFlag: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '派工单打印')
      ?.selectValue,
    printLabelFlag: formList.value.find(
      (item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '轮次标签打印'
    )?.selectValue,
    salaryFlag: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '财务审核')
      ?.selectValue,
    pageNum: currentPage.value,
    pageSize: pageSize.value,
    userId: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '归属人')
      ?.selectValue
  })
  isLoading.value = false
  tableData.value = tableDataList.list.map((item: any) => {
    item.partName1 = item.partName.key
    item.partName = item.partName.value
    return item
  })

  total.value = tableDataList.total
  currentRow()
}, 500)
onMounted(() => {
  getTableList()
})
watch(
  () =>
    formList.value.map((item: any) => {
      item.selectValue, item.inputValue, item.dateValue, item.checked
    }),
  () => {
    getTableList()
  }
)
// 点击表给另一张表传数据
const currentTableRow = ref({}) as any
const currentRow = async (row: any = tableData.value[0] ? tableData.value[0] : {}) => {
  currentTableRow.value = row
  currentTableRow.value.partName = currentTableRow.value.partName1
  getTableList2()
}
const selectedLists = ref([])
const selectTableList = (selectedList: any) => {
  selectedLists.value = selectedList
  selectedLists.value.forEach((item: any) => {
    item.partName = item.partName1
  })
}

// 表二
const tableHeader2 = ref([
  {
    label: '号码',
    prop: 'sizeNo'
  },
  {
    label: '派工量',
    prop: 'qty'
  }
])
const tableData2 = ref([])
const isLoading2 = ref(true)
const total2 = ref(0)
const getTableList2 = debounce(async () => {
  isLoading2.value = true
  let tableDataList = await service.post<any, any>('/cut/plan/dispatch/dispatchDetailList', {
    ...currentTableRow.value,
    slipDateStart: currentTableRow.value.dispatchDate
  })
  isLoading2.value = false
  tableData2.value = tableDataList
  // currentRow2()
}, 500)

const getSelectList = async () => {
  formList.value[5].selectOptions.push(
    {
      optionKey: '全部',
      optionValue: ' ',
      optionLabel: '全部'
    },
    {
      optionKey: '已打印',
      optionValue: 'Y',
      optionLabel: '已打印'
    },
    {
      optionKey: '未打印',
      optionValue: 'N',
      optionLabel: '未打印'
    }
  )
  formList.value[6].selectOptions.push(
    {
      optionKey: '全部',
      optionValue: ' ',
      optionLabel: '全部'
    },
    {
      optionKey: '已打印',
      optionValue: 'Y',
      optionLabel: '已打印'
    },
    {
      optionKey: '未打印',
      optionValue: 'N',
      optionLabel: '未打印'
    }
  )
  formList.value[7].selectOptions.push(
    {
      optionKey: '我的',
      optionValue: '1',
      optionLabel: '我的'
    },
    {
      optionKey: '全部',
      optionValue: '',
      optionLabel: '全部'
    }
  )
  formList.value[8].selectOptions.push(
    {
      optionKey: '全部',
      optionValue: ' ',
      optionLabel: '全部'
    },
    {
      optionKey: '已审核',
      optionValue: 'Y',
      optionLabel: '已审核'
    },
    {
      optionKey: '未审核',
      optionValue: 'N',
      optionLabel: '未审核'
    }
  )
}
onMounted(() => {
  getSelectList()
})

// 打印汇总表
const printArr = ref([]) as any
const printSummary = async () => {
  const arr = []
  if (formList.value[0].dateValue === '') {
    JMessage.warning('请选择生产日期')
    return
  }
  const beginDate = formList.value[0].dateValue[0]
  const endDate = formList.value[0].dateValue[1]
  const res = (await LoginWork.post(`/cut/plan/dispatch/summary/print?beginDate=${beginDate}&endDate=${endDate}`)) as any
  for (const key in res.data.worker2HeadMap) {
    arr.push({
      name: key,
      arr: res.data.worker2HeadMap[key].map((item: any) => {
        item.partName1 = item.partName.key
        item.partName = item.partName.value
        return item
      }),
      total: res.data.worker2HeadMap[key].reduce((previousValue: any, currentValue: any) => previousValue + currentValue.dispatchQty, 0),
      printDate: res.data.printDate,
      dispatchDateDuring: res.data.dispatchDateDuring
    })
  }
  printArr.value = arr
  setTimeout(() => {
    const qrCodeContainer = document.querySelector<any>('.printContent2')
    if (qrCodeContainer) {
      qrCodeContainer.style.display = 'block'
      const printWindow = window.open('', '_blank')
      printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印汇总表</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto;
            }
            @media print {
                /* 打印时的样式 */


                /* 其他打印样式 */
            }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
                }
            .headerTable {
                height: auto;
                border: 0px solid #000;
                text-align: center;
                display: flex;
                margin: 20px 20px 0px;
                vertical-align: top;
            }

            .title {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .center {
                text-align: center;
            }

            .right {
                text-align: right;
            }

            .left {
                text-align: left;
            }

            .no-padding {
                padding: 0;
            }

            .no-margin {
                margin: 0;
            }

            .margin-5 {
                margin: 5px;
            }

            .margin-top-5 {
                margin-top: 5px;
            }

            .margin-top-15 {
                margin-top: 15px;
            }

            .size-8 {
                font-size: 8px !important;
            }

            .size-10 {
                font-size: 10px;
            }

            .size-12 {
                font-size: 12px;
            }

            .size-14 {
                font-size: 14px;
            }

            .size-16 {
                font-size: 17px;
            }

            .size-18 {
                font-size: 18px;
            }

            .size-24 {
                font-size: 24px;
            }

            #date-tip {
                position: relative;
            }

            span.tip {
                display: inline-block;
                height: 14px;
                line-height: 14px;
                margin-right: 30px;
            }

            table {
                font-size: 10px;
                border-collapse: collapse;
                border-spacing: 0;
                border-collapse: collapse;
                border-spacing: 0;
                empty-cells: show;
                width: 100%;
            }

            table th,
            table td {
                border: 1px solid #000;
                font-size: 12px;
            }

            table.no-border,
            table.no-border th,
            table.no-border td {
                border: 0px;
            }

            table td.no-left-border {
                border-left: 0px;
            }

            table td.no-right-border {
                border-right: 0px;
            }

            .mainTable {
                margin: 0 20px;
            }

            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

      // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
      const cloneContainer = qrCodeContainer.cloneNode(true)
      printWindow!.document.body.appendChild(cloneContainer)

      printWindow!.document.write(`
        </body>
      </html>
    `)
      printWindow!.document.close()

      // 开始打印
      printWindow!.print()

      // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
      qrCodeContainer.style.display = 'none'
    }
  }, 500)
}

// 打印轮次标签按搜索条件
const loading = ref()
const printTag = ref({}) as any
const printOnSearch = async (type: number = 1) => {
  if (type === 1) {
    if (formList.value[0].dateValue === '') {
      JMessage.warning('请选择生产日期')
      return
    }
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    const res = (await service.post('/cut/plan/dispatch/label/print', {
      slipDateEnd: formList.value[0].dateValue[1],
      slipDateStart: formList.value[0].dateValue[0]
    })) as any
    res.list.forEach((item: any) => {
      item.partName1 = item.partName.key
      item.partName = item.partName.value
      let qrCodeData = item.labelNo // 替换为你需要生成二维码的数据
      qrcode.toDataURL(qrCodeData, (err: any, url: any) => {
        if (err) {
          JMessage.error(err)
        } else {
          qrCodeData = url
        }
      })
      item.imgUrl = qrCodeData
    })
    printTag.value = res
    loading.close()
  } else if (type === 2) {
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    const res = (await service.post('/cut/plan/dispatch/label/un/print')) as any
    res.list.forEach((item: any) => {
      item.partName1 = item.partName.key
      item.partName = item.partName.value
      let qrCodeData = item.labelNo // 替换为你需要生成二维码的数据
      qrcode.toDataURL(qrCodeData, (err: any, url: any) => {
        if (err) {
          JMessage.error(err)
        } else {
          qrCodeData = url
        }
      })
      item.imgUrl = qrCodeData
    })
    printTag.value = res
    loading.close()
  }
}
watch(printTag, () => {
  nextTick(() => {
    const qrCodeContainer = document.querySelector<any>('.printContent')
    if (qrCodeContainer) {
      qrCodeContainer.style.display = 'block'
      const printWindow = window.open('', '_blank')
      printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印标签</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto;
            }
            @media print {
                /* 打印时的样式 */
              .page-break {
                break-after: page;
              }

                /* 其他打印样式 */
            }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
            }
            .pad3 {
                padding: 2px;
            }

            .main {
                display: flex;
                justify-content: center;
            }

            .left {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                margin-right: 2px;
            }


            .title {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .center {
                text-align: center;
            }

            .right {
                text-align: right;
            }

            .left {
                text-align: left;
            }

            .no-padding {
                padding: 0;
            }

            .no-margin {
                margin: 0;
            }

            .margin-5 {
                margin: 5px;
            }

            .margin-top-5 {
                margin-top: 5px;
            }

            .margin-top-15 {
                margin-top: 15px;
            }

            .size-8 {
                font-size: 8px !important;
            }

            .size-10 {
                font-size: 10px;
            }

            .size-12 {
                font-size: 12px;
            }

            .size-14 {
                font-size: 14px;
            }

            .size-16 {
                font-size: 17px;
            }

            .size-18 {
                font-size: 18px;
            }

            .size-24 {
                font-size: 24px;
            }

            #date-tip {
                position: relative;
            }

            span.tip {
                display: inline-block;
                height: 14px;
                line-height: 14px;
                margin-right: 30px;
            }

            table {
                font-size: 10px;
                border-collapse: collapse;
                border-spacing: 0;
                border-collapse: collapse;
                border-spacing: 0;
                empty-cells: show;
                width: 100%;
            }

            table th,
            table td {
                border: 1px solid #000;
                font-size: 12px;
            }

            table.no-border,
            table.no-border th,
            table.no-border td {
                border: 0px;
            }

            table td.no-left-border {
                border-left: 0px;
            }

            table td.no-right-border {
                border-right: 0px;
            }

            .mainTable {
                margin: 0 20px;
            }

            /* 备料派工单汇总表 */
            .header {
                display: flex;
                justify-content: space-evenly;
            }

            .footer {
                margin-top: 20px;
                margin-right: 100px;
                display: flex;
                justify-content: right;
            }



            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

      // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
      const cloneContainer = qrCodeContainer.cloneNode(true)
      printWindow!.document.body.appendChild(cloneContainer)

      printWindow!.document.write(`
        </body>
      </html>
    `)
      printWindow!.document.close()

      // 开始打印
      printWindow!.print()

      // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
      qrCodeContainer.style.display = 'none'
    }
  })
})
const printObj = ref({
  lotHead: {
    cutNo: '',
    lotNo: '',
    style: '',
    color: ''
  }
}) as any
const download = async (row: any, label: any) => {
  if (label.label === '打印派工单') {
    const res = (await LoginWork.post(`/cut/plan/dispatch/combine/print?planNo=${row.planNo}`)) as any
    let qrCodeData = res.data.planNo // 替换为你需要生成二维码的数据
    qrcode.toDataURL(qrCodeData, (err: any, url: any) => {
      if (err) {
        JMessage.error(err)
      } else {
        qrCodeData = url
      }
    })
    res.data.imgUrl = qrCodeData
    res.data.list.forEach((item: any) => {
      item.partName1 = item.partName.key
      item.partName = item.partName.value
    })
    printObj.value = res.data
    getTableList()
  }
  if (label.label === '打印标签') {
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    const res = (await service.post(`/cut/plan/dispatch/combine/label/print?planNo=${row.planNo}`)) as any
    res.list.forEach((item: any) => {
      item.partName1 = item.partName.key
      item.partName = item.partName.value
      let qrCodeData = item.labelNo // 替换为你需要生成二维码的数据
      qrcode.toDataURL(qrCodeData, (err: any, url: any) => {
        if (err) {
          JMessage.error(err)
        } else {
          qrCodeData = url
        }
      })
      item.imgUrl = qrCodeData
    })
    printTag.value = res
    loading.close()
    getTableList()
  }
}
watch(printObj, () => {
  nextTick(() => {
    const qrCodeContainer = document.querySelector<any>('.printContent3')
    if (qrCodeContainer) {
      qrCodeContainer.style.display = 'block'
      const printWindow = window.open('', '_blank')
      printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印派工单</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            table { page-break-inside:auto }
            tr    { page-break-inside:avoid; page-break-after:auto }
            thead { display:table-header-group }
            tfoot { display:table-footer-group }
            @page {
              size: auto;
              margin: 1mm;
            }
            @media print {
                /* 打印时的样式 */
                
                /* 其他打印样式 */
            }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
            }
            .pad3 {
                padding: 3px;
            }

            .main {
                display: flex;
                justify-content: center;
            }

            .left {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                margin-right: 5px;
            }
            .headerTable {
                height: auto;
                border: 0px solid #000;
                text-align: center;
                display: flex;
                margin: 5px 20px 0px;
                vertical-align: top;
            }

            .title {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .center {
                text-align: center;
            }

            .right {
                text-align: right;
            }

            .left {
                text-align: left;
            }

            .no-padding {
                padding: 0;
            }

            .no-margin {
                margin: 0;
            }

            .margin-5 {
                margin: 5px;
            }

            .margin-top-5 {
                margin-top: 5px;
            }

            .margin-top-15 {
                margin-top: 15px;
            }

            .size-8 {
                font-size: 8px !important;
            }

            .size-10 {
                font-size: 10px;
            }

            .size-12 {
                font-size: 12px;
            }

            .size-14 {
                font-size: 14px;
            }

            .size-16 {
                font-size: 17px;
            }

            .size-18 {
                font-size: 18px;
            }

            .size-24 {
                font-size: 24px;
            }

            #date-tip {
                position: relative;
            }

            span.tip {
                display: inline-block;
                height: 14px;
                line-height: 14px;
                margin-right: 30px;
            }

            table {
                font-size: 10px;
                border-collapse: collapse;
                border-spacing: 0;
                border-collapse: collapse;
                border-spacing: 0;
                empty-cells: show;
                width: 100%;
            }

            table th,
            table td {
                border: 1px solid #000;
                font-size: 12px;
            }

            table.no-border,
            table.no-border th,
            table.no-border td {
                border: 0px;
            }

            table td.no-left-border {
                border-left: 0px;
            }

            table td.no-right-border {
                border-right: 0px;
            }

            .mainTable {
                margin: 0 20px;
            }

            /* 备料派工单汇总表 */
            .header {
                display: flex;
                justify-content: space-evenly;
            }

            .footer {
                margin-top: 20px;
                margin-right: 100px;
                display: flex;
                justify-content: right;
            }



            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

      // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
      const cloneContainer = qrCodeContainer.cloneNode(true)
      printWindow!.document.body.appendChild(cloneContainer)

      printWindow!.document.write(`
        </body>
      </html>
    `)
      printWindow!.document.close()

      // 开始打印
      printWindow!.print()

      // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
      qrCodeContainer.style.display = 'none'
    }
    // const qrCodeContainer = document.querySelector<any>('.printContent4')
  })
})
</script>

<style scoped>
.printContent3 {
  display: none;
}

:deep(.el-table__body tr.current-row > td) {
  color: black;
}

:deep(.el-table__row tr.current-row > td) {
  background-color: #ffe080 !important;
  color: black;
}

:deep(.el-table .el-table__cell) {
  padding: 0;
}

:deep(.el-table__body tr:first-child) {
  background-color: white;
  color: black;
}

.JSelect {
  width: 150px;
}

/* 打印 */
.pad3 {
  padding: 3px;
}

.main {
  display: flex;
  justify-content: center;
}

.left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.headerTable {
  height: auto;
  border: 0px solid #000;
  text-align: center;
  display: flex;
  margin: 20px 20px 0px;
  vertical-align: top;
}

.title {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.left {
  text-align: left;
}

.no-padding {
  padding: 0;
}

.no-margin {
  margin: 0;
}

.margin-5 {
  margin: 5px;
}

.margin-top-5 {
  margin-top: 5px;
}

.margin-top-15 {
  margin-top: 15px;
}

.size-8 {
  font-size: 8px !important;
}

.size-10 {
  font-size: 10px;
}

.size-12 {
  font-size: 12px;
}

.size-14 {
  font-size: 14px;
}

.size-16 {
  font-size: 17px;
}

.size-18 {
  font-size: 18px;
}

.size-24 {
  font-size: 24px;
}

#date-tip {
  position: relative;
}

span.tip {
  display: inline-block;
  height: 14px;
  line-height: 14px;
  margin-right: 30px;
}

table {
  font-size: 10px;
  border-collapse: collapse;
  border-spacing: 0;
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  width: 100%;
}

table th,
table td {
  border: 1px solid #000;
  font-size: 12px;
}

table.no-border,
table.no-border th,
table.no-border td {
  border: 0px;
}

table td.no-left-border {
  border-left: 0px;
}

table td.no-right-border {
  border-right: 0px;
}

.mainTable {
  margin: 0 20px;
}
.select {
  width: 780px;
}
</style>
